<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <meta property="qc:admins" content="6525276424516367" />
    <meta property="wb:webmaster" content="ce8327d47982a584" />

    <title>慕图素材</title>

    <link rel="stylesheet" href="/static/lib/bootstrap/css/bootstrap.css">
    <link rel="stylesheet" href="/static/schema/default/css/base.css">
    <link href="/static/schema/default/css/dashboard.css" rel="stylesheet">

    <script src="/static/lib/jquery/jquery-2.1.3.min.js"></script>
    <script src="/static/lib/bootstrap/js/bootstrap.js"></script>

    <style type="text/css">
        .modal-body{

            height: 500px;
        }
        #himg {
            margin-left: 10px;
        }
    </style>
</head>
<body>
    <nav class="navbar navbar-inverse navbar-fixed-top">
        <div class="container-fluid">
            <div id="navbar" class="navbar-collapse collapse row">
                <div class="col-sm-offset-1">
                    <ul class="nav navbar-nav">
                       <li >
                            <a href="/">首页</a>
                        </li>
                        <li >
                            <a href="/auth/index">登录</a>
                        </li>
                        <li >
                            <a href="/auth/logout">退出</a>
                        </li>
                        <li >
                            <a href="/resource/upload/index">上传资源</a>
                        </li>
                         <li >
                            <a href="/resource/matter/create/index">创建素材</a>
                        </li>
                        <li >
                            <a href="/resource/matter/manage/index">素材管理</a>
                        </li>
                       
                        <li >
                            <a href="/resource/binder/manage/index">收藏夹管理</a>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </nav>
    <div class="container-fluid">
        <div class="row">
            <div class="col-sm-6 col-sm-offset-2 alertDiv" id="notice_messages"></div>
        </div>
    </div>
    <div class="container-fluid">
        <div class="row">
            <div class="col-sm-10 col-sm-offset-1 main">
                <div id="helloDiv">
                    <form action="" method="post" id="loginForm" class="form-horizontal" for="ala_ocr"enctype="multipart/form-data">
                        <div class="form-group" >
                            <a href="#" onclick="toLogin('qq')">
                                <img src="http://qzonestyle.gtimg.cn/qzone/vas/opensns/res/img/Connect_logo_5.png"></a>
                            <a href="#" onclick="toLogin('wb')">
                                <img src="http://www.sinaimg.cn/blog/developer/wiki/48.png"></a>
                        </div>

                        <div class="form-group">
                            <label class="control-label col-sm-1" for="email">邮箱：</label>
                            <div class="controls col-sm-3">
                                <input class="form-control" name="email" type="text" value=""></div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-sm-1" for="address">密码：</label>
                            <div class="controls col-sm-3">
                                <input class="form-control" name="passwd" type="password" value=""></div>
                        </div>
                        <div class="form-group">
                            <label class="control-label col-sm-1" for="address"></label>
                            <button class="btn btn-primary" onclick="pwLogin()" type="button">登录</button>
                        </div>

                    </form>
                </div>
                <div id="userDiv" style="display:none;">
                    <h3>
                        欢迎您:
                        <span id="nickSpan"></span>
                        <img id="himg" src=""></h3>
                </div>
            </div>
        </div>
    </div>
    <!-- Modal -->
    <div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">

                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
                    <h5 id="myModalLabel">登录</h5>
                </div>
                <div  id="frameDiv"  height="100%">
                    <iframe id="redictFrame" src="" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" width="98%" height="400px" ></iframe>

                </div>

            </div>
    </div>
</div>
</div>
<!-- /Modal -->

<script type="text/javascript">


    function aflogin(ticket){
        //alert("登录成功!");
        $("#modal").modal('hide');
        url = "/auth/info?ticket=" + ticket;
        $.get(url, function (body) {
            res = body;
            if (res.ok) {
                $("#nickSpan").text(res.data.ses.Nick);
                $("#himg").attr("src", res.data.ses.Himg);
                $("#helloDiv").hide();
                $("#userDiv").show();
            }else {
                alert(res.msg)
            }
        }).fail(function() {
            alert("ajax 网络错误");
        });
    }

    function toLogin(way) {
         $("#modal").modal('show');
        url = "/auth/oauthurl?way=" + way;

        $.get(url, function (body) {
            res = body;
            if (res.ok) {
                $("#frameDiv").show();
                $("#redictFrame").attr("src", res.data.oauth_url)
                
            }else {
                alert(res.msg)
            }
        }).fail(function() {
            alert("ajax 网络错误");
        });
    }

    function pwLogin(){
        var email =$("#loginForm [name='email']").val();
        var passwd = $("#loginForm [name='passwd']").val();

        var url = "/auth/pwlogin?email=" + email+ "&passwd=" + passwd;

        $.get(url, function (body) {
           // res = body;
            res = body;
            if (res.ok) {
                aflogin(res.data.ticket);
            }else {
                alert(res.msg)
            }
        }).fail(function() {
            alert("ajax 网络错误");
        });

    }

    
</script>

</body>
</html>